<template>
  <div>
    <div class="model-title-css">
      <div class="title">招标管理</div>
    </div>
    <div class="background_wrap public-flex-row">
      <!-- <div class="left-box WholeScroll">
        <el-tree class="tender-registration-tree" :data="leftList" node-key="value" ref="treeData" @node-click="handleNodeClick" highlight-current :expand-on-click-node="false" :default-expanded-keys="defaultTreeKey" :props="defaultProps">
        </el-tree>
      </div> -->
      <div class="right-box">
        <div class="operate_wrap flex" style="margin-top: 0">
          <div class="flex-left">
            <el-button type="primary" size="small" class="add buildButtonStyle mr10" round @click="add" v-permission="permission.add">
              <i class="iconfont icon-icon_add"></i>&nbsp;新增
            </el-button>

            <el-upload class="daochu buildButtonStyle bidTable-import-button" style="margin-left: 10px;display:none;" action="" :before-upload="submitImportExcel">
              <el-button slot="trigger" id="excel-import-button" class="delete" size="small" style="width: 0px;opacity:0;margin-left: -100px;"><i class="iconfont icon-icon_zp"></i>&nbsp; 导入excel
              </el-button>
            </el-upload>

            <el-button class="delete" size="small" style="width: 110px;" @click="downfile">
              <i class="iconfont icon-daochu"></i> 模板下载
            </el-button>

            <el-button type="primary" class="delete" size="small" @click="importExcel" style="width: 88px;"><i class="iconfont icon-icon_zp"></i>&nbsp; 导入</el-button>

            <el-button type="primary" size="small" class="daochu" style="width: 88px" @click="exportExcel" v-permission="permission.show"><i class="iconfont icon-daochu"></i>导出</el-button>
          </div>

          <div class="flex-center g-flex flex-right">
            <el-input class="input" size="small" v-model="search.projectCode" placeholder="项目编号" clearable @change="getList(true)"></el-input>

            <el-input class="input" size="small" v-model="search.projectName" placeholder="项目名称" clearable @change="getList(true)"></el-input>

            <el-button class="search" size="small" @click="getList(true)"><i class="iconfont icon-sousuo"></i>&nbsp;搜索
            </el-button>
          </div>
        </div>

        <div class="list_wrap">
          <el-table class="list_table table-two-blue" :border="true" :row-class-name="tableRowStyleName" :cell-class-name="tableCellStyleName" :header-cell-class-name="tableHeaderCellStyleName" :stripe="true" ref="multipleTable" :data="list" @cell-click="cellClick" tooltip-effect="dark" style="width: 100%; font-family: PingFangSC-Regular; font-size: 14px;">
            <el-table-column width="150" show-overflow-tooltip label="项目编号" prop="projectCode">
              <template slot-scope="scope"><span class="g-blue">{{scope.row.projectCode}}</span></template>
            </el-table-column>

            <el-table-column width="450" show-overflow-tooltip label="项目名称" prop="projectName">
              <template slot-scope="scope"><span class="g-blue">{{scope.row.projectName}}</span></template>
            </el-table-column>

            <el-table-column width="80" show-overflow-tooltip prop="industry" label="行业">
              <template slot-scope="scope">{{scope.row.industry}}</template>
            </el-table-column>

            <el-table-column width="320" show-overflow-tooltip label="建设单位" prop="constructUnit">
              <template slot-scope="scope">{{scope.row.constructUnit}}</template>
            </el-table-column>

            <el-table-column width="150" show-overflow-tooltip label="标底价格" prop="biddingEndPrice">
              <template slot-scope="scope">
                <div style="text-align: right;"> {{scope.row.biddingEndPrice}}</div>
              </template>
            </el-table-column>

            <el-table-column width="150" show-overflow-tooltip label="中标价格" prop="biddingUnit">
              <template slot-scope="scope">
                <div style="text-align: right;">{{scope.row.biddingPrice}}</div>
              </template>
            </el-table-column>

            <el-table-column width="150" show-overflow-tooltip label="负责人" prop="leader">
              <template slot-scope="scope">{{scope.row.leader}}</template>
            </el-table-column>

            <el-table-column show-overflow-tooltip width="250" label="操作" fixed="right" align="center">
              <template slot-scope="scope">
                <el-button size="mini" v-permission="permission.show" class="menu_icon iconfont icon-icon_look action_color1" @click="showDialog('check','招标管理查看',scope.row.id)">&nbsp;查看</el-button>
                <el-button size="mini" v-permission="permission.edit" class="menu_icon iconfont icon-xiugai-copy action_color1" @click="showDialog('edit','招标管理编辑',scope.row.id)">&nbsp;编辑</el-button>
                <el-button size="mini" v-permission="permission.del" class="menu_icon iconfont icon-shanchu action_color2" @click="showDialog('delete','招标管理删除',scope.row.id)">&nbsp;删除</el-button>
              </template>
            </el-table-column>
          </el-table>

          <el-pagination style="float: right; margin-top: 30px;" layout="prev, pager, next" :page-size="search.pageSize" :total="search.pageSum" :current-page="search.pageNo + 1" :prev-text="tablePaginationPrev" :next-text="tablePaginationNext" @current-change="paginationChange">
          </el-pagination>
        </div>
      </div>
    </div>
    <Detail :postDetail="postDetailData" @reloadList="getList(true)"></Detail>
  </div>
</template>

<script>
//  复制粘贴指定模块名只改下面这个名字就好了
import { doCreateObject, tableCellStyleGol, tableHeaderCellStyleGol, tableRowStyleGol } from "@/utils/publicFun";
import msgUtil from "@/utils/msgUtil";
import biddingManagement from "@/api/buss/biddingManagement"
import WorkFlowBtn from "@/components/WorkFlow/table/index";
import crudDict from "@/api/system/dict";
import publicSearchData from '@/mixins/publicSearchData'
export default {
  mixins: [publicSearchData],
  name: `biddingManagement`,
  components: {
    WorkFlowBtn,
    Detail: require(`./biddingManagement-detail/biddingManagement-detail`).default,
  },
  data() {
    return {
      leftList: [],
      defaultTreeKey: ['1'],
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      defaultCheckKey: [],
      routerData: '',
      permission: {
        add: ['100', '1000189:add'],
        show: ['100', '1000189:show'],
        edit: ['100', '1000189:edit'],
        del: ['100', '1000189:del'],
      },
      loading: false,
      tableRowStyleName: tableRowStyleGol,
      tableCellStyleName: tableCellStyleGol,
      tableHeaderCellStyleName: tableHeaderCellStyleGol,
      tablePaginationPrev: '上一页',
      tablePaginationNext: '下一页',
      companyTree: [], // 公司下拉
      projectTree: [], // 项目下拉
      sectionTree: [], // 标段下拉
      imgTitle: '',
      imgSrc: '',
      imgArray: [],
      processDialog: false,
      title: '招标管理',
      //模态框
      inputNums: '',
      selectStatus: '',
      options: [],
      showSelectDialog: false,
      bdList: [],
      biddingTypes: [],
      selectValue: '',
      // 搜索参数
      search: {
        bm: '',//项目编码
        biddingName: '',
        pageNo: 0,
        pageSize: 10,
        pageSum: 0,
        // biddingType: '',
        projectIds: '',
        // bhyxq: '',
        startTime: '',
        endTime: '',
      },
      // 列类型表
      list: [],
      typeOptions: [{
        label: "审核状态",
        value: ""
      }],
      // 已经选择的列表id
      selectedIds: [],
      // 同意审核的dialog
      agreeDialog: {
        show: false, // 弹窗显示
        detailId: '', // 当前审核的id
        approverShow: false, // 是否有下级审核人
        approver: '', // 已选审核人
      },
      // 向详情子组件的传值
      postDetailData: {
        show: false,
        type: 'build'
      },
      //  施工合同列表
      workContractList: [],
      //  选择的施工合同
      contractId: [],
      contract: null,
      // el的table列表
      elTableList: [
        {
          name: '项目名称',
          prop: 'projectName',
          width: '180',
        },
        {
          name: '招标名称',
          prop: 'biddingTitle',
          width: '180',
        },
        {
          name: '招标类型',
          prop: 'biddingTypeName',
          width: '180',
        },
        {
          name: '承办部门',
          prop: 'contractDept',
          width: '180',
        },
        {
          name: '承办人',
          prop: 'contractor',
          width: '180',
        },
        {
          name: '创建时间',
          prop: 'createTime',
          width: '180',
        }

      ],
      /**
       * 流程提交数据
       * */
      reportData: {
        //  下一步接收人
        auditorIds: [],
        //  提交，审核意见
        content: "",
        //  被操作表单id
        id: "",
        //  附件表
        fileList: [],
      },
      //  显示报审对话框
      showReportDialog: false,
      //  审核候选人列表
      reportSelection: [
        {
          name: "1",
          id: "1"
        }
      ],
      //  显示审核选择项框
      showAuditDialogSelection: false,
      //  显示审核选择项框(不存在选择项)
      showAuditDialogNoSelection: false,
      //  显示驳回对话框
      showRejectDialog: false,
      //  控制审核框的附件栏显示
      flowShowAttachmanet: false,
      //  搜索状态值枚举
      flowShowNames: [
        { key: '全部审核状态', value: null },
        { key: '待施工方处理', value: '待施工方处理' },
        { key: '待监理复核', value: '待监理复核' },
        { key: '已办结', value: '已办结' },
      ],
      //  当前页面是否允许新增
      //  在分页时，根据返回值控制
      allowAdd: false,
      fileTitle: '文件',
      nowFileList: [],
      showFileDialog: false,
    }
  },
  created() {
    this.initData()
  },
  methods: {
    showDialog(type, typeNmae, detailId) {
      switch (type) {
        case 'build':
          this.postDetailData = {
            show: true,
            type: type,
            typeNmae: typeNmae,
            detailId: '',
          }
          break
        case 'edit':
        case 'check':
          this.postDetailData = {
            show: true,
            type: type,
            typeNmae: typeNmae,
            detailId: detailId,
          }
          break
        case 'delete':
          if (detailId === '') {
            msgUtil.error2('请先选择要删除的记录！')
            return
          }
          msgUtil.confirm('确认删除该条数据?').then(res => {
            let idlist = []
            idlist.push(detailId)
            let param = {
              ids: idlist
            }
            biddingManagement.del(param).then(res => {
              if (res.code === 200) {
                msgUtil.success2('删除成功!')
                this.getList()
              } else {
                msgUtil.error2(res.data.message)
              }
            })
          })
          break
      }
    },
    handleNodeClick(item, index) {
      console.log(item)
      this.search.projectIds = item.value
      this.getList(true)
    },
    add() {
      this.postDetailData = {
        show: true,
        type: 'build',
        typeName: '新增',
        detailId: '',
      }
    },
    //  提交excel导入文件选择
    submitImportExcel(file) {
      let fd = new FormData()
      fd.append('file', file)
      this.$httpPost(`/buss/biddingmanagement/importExcel`, fd, {
        headers: {
          'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundaryIOi8qEBAFV1KN25n',
        }
      }).then(res => {
        if (res.code === 200) {
          this.$message.success("导入成功")
          this.getList(true);
        } else {
          this.$messageError("请求导入excel失败:" + res.data.message)
        }
      }).catch(e => {
        console.log(e);
      })
    },
    //  下载模板
    downfile() {
      this.$httpPost(`/buss/biddingmanagement/downfile`,
        this.search, { responseType: 'blob' }).then(res => {
          doCreateObject(res, '招标管理导入模板.xlsx');
        }).catch(e => {
          console.log(e);
          this.$messageError("请求excel模板失败")
        })
    },
    importExcel() {
      $("#excel-import-button").trigger("click");
    },
    exportExcel() {
      this.$httpPost('/buss/biddingmanagement/exportExcel', { param: this.search, }, { responseType: 'blob' }).then(res => {
        doCreateObject(res, '招标管理.xls')
      }).catch(e => {
        console.log(e);
      })
    },
    approve(obj) {
      this.postDetailData = {
        show: true,
        type: 'approve',
        typeName: '审核',
        detailId: obj.id,
      }
    },
    edit(obj) {
      this.postDetailData = {
        show: true,
        type: 'edit',
        typeName: '编辑',
        detailId: obj.id,
      }
    },
    detail(obj) {
      this.postDetailData = {
        show: true,
        type: 'check',
        typeName: '查看',
        detailId: obj.id,
      }
    },
    del(obj) {
      if (obj.id === '') {
        msgUtil.error2('请先选择要删除的记录！')
        return
      }
      msgUtil.confirm('确认删除该条数据?').then(res => {
        let idlist = []
        idlist.push(obj.id)
        let param = {
          ids: idlist
        }
        biddingManagement.del(param).then(res => {
          if (res.code == 200) {
            msgUtil.success2('删除成功!')
            this.getList()
          } else {
            msgUtil.error2(res.data.message)
          }
        })
      })
    },
    initData() {
      this.getList(true)

    },
    imgListClick(item) {
      this.imgArray = []
      this.imgTitle = item.title
      this.imgSrc = item.src
      this.imgArray.push(item.src)
      this.processDialog = true
    },
    // 点击单元格 任务名称展示详情
    cellClick(row, column, cell, event) {
      if (column.property === "projectName") {
        this.postDetailData = {
          show: true,
          type: 'check',
          typeName: '查看',
          detailId: row.id,
        }
      }
    },
    // 格式化表单数据
    formatter(row, column) {
      let array = column.property.split('.')
      let result
      array.forEach((item, i) => {
        result = result === undefined ? row[item] : result[item]
      })
      if (result === '' || result === undefined) {
        return '--'
      } else {
        if (!isNaN(result) && (column.property !== 'name')) {
          switch (column.property) {
            // 举个栗子，金额
            case "money":
              return this.$publicJs.exchangeKuaiJi(result);
            case "checkDate":
          }
        }
        return result
      }
    },
    // 获取列表 api
    getList(reload) {
      if (reload) {
        this.search.pageNo = 0
        this.search.pageSum = 0
      }
      this.list = []
      biddingManagement.listPage(this.search).then(res => {
        if (res.code == 200) {
          if (res.data.content.length > 0) {
            this.list = res.data.content
          }
          this.search.pageSum = res.data.totalElements
        } else {
          msgUtil.error2(res.data.message)
        }
      })
    },
    // 切换列表
    paginationChange(index) {
      this.search.pageNo = index - 1
      this.getList()
    }
    ,
    // 显示详情弹窗 不同状态
    showDetailDialog(flag, params) {
      if (!params) {
        params = {}
      }
      params.contractId = this.search.contractId;
      switch (flag) {
        case 'build':
          this.postDetailData = {
            show: true,
            type: 'build',
            params: params
          }
          break
        case 'update':
          this.postDetailData = {
            show: true,
            type: 'edit',
            params: params
          }
          break
        case 'copy':
          this.postDetailData = {
            show: true,
            type: 'copy',
            params: params
          }
          break
        case 'show':
          this.postDetailData = {
            show: true,
            type: 'check',
            params: params,
            isAudit: flag
          }
          break
        case 'audit':
          this.postDetailData = {
            show: true,
            type: 'approve',
            params: params,
            isAudit: flag
          }
          break
        case 'reply':
          this.postDetailData = {
            show: true,
            type: 'reply',
            params: params,
            isAudit: flag
          }
          break
      }
    }
    ,
    handleSelectionChange(val) {
      this.selectedIds = []
      val.forEach(item => {
        this.selectedIds.push(item.id)
      })
    }
    ,
    // 事件处理的api请求
    sealDealHttp(url, query, param, callback) {
      if (!url.startsWith("http")) {
        url = this.$store.state.httpHost.buss + url;
      }
      this.$httpPost(
        url + query,
        param
      ).then(res => {
        if (res.data.status === 1) {
          if (callback) callback(res.data)
          // 重新获取数据
          setTimeout(() => {
            this.getList(true)
          }, 1000)
        } else {
          this.$messageError(res.data.message)
        }
      }).catch(res => {
        console.log(res)
      })
    }
    ,
    // 列表的操作流程
    handleClickDeal(res) {
      let type = res.type
      let detailId = res.detailId
      let url = res.url
      let name = res.name
      let actions = res.actions
      switch (type) {
        // 修改
        case 'update':
          // 显示详情弹窗
          this.showDetailDialog(type, {
            detailId: detailId,
            actions: actions
          })
          break
        // 复制
        case 'copy':
          // 显示详情弹窗
          this.showDetailDialog(type, {
            detailId: detailId,
            actions: actions
          })
          break
        // 查看
        case 'show':
        case 'audit':
        case 'reply':
          // 显示详情弹窗
          this.showDetailDialog(type, {
            detailId: detailId,
            actions: actions
          })
          break
        // 上报、重新上报
        case 'report':
          this.$confirm('是否上报(重新上报)?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'info'
          }).then(() => {
            console.log("fffffffffffffffff", url)

            /* this.sealDealHttp(url, `?id=${detailId}`, () => {
                 this.$messageSuccess('上报成功!')
             })*/
          }).catch(() => {
            console.log('请求出现错误');
          });
          break
        // 上报、重新上报
        /*  case 'report':
            this.reportData.id = detailId;
            this.showReport();
            break*/
        // 删除
        case 'delete':
          if (detailId === '') {
            this.$messageError('请先选择要删除的记录！')
            return
          }
          this.$confirm('确定是否删除？', '提示', {
            confirmButtonClass: 'iconfont icon-icon_ok',
            cancelButtonClass: 'iconfont icon-icon_cancel',
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'info'
          }).then(() => {
            this.sealDealHttp(url, ``, {
              idList: detailId.split(','),
            }, () => {
              onEmit.$emit('Ajax')
              this.$messageSuccess('删除成功!')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break
      }
    }
    ,
  }
  ,
}
</script>

<style scoped lang="scss">
.operate_wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  height: 40px;
  width: 100%;
  box-sizing: border-box;
  .mr10 {
    margin-right: 10px;
  }
  ::v-deep {
    .el-button + .el-button {
      margin-left: 10px;
    }
  }
  .select {
    width: 150px;
    margin-right: 15px;
  }
  .input {
    width: 250px;
    margin-right: 15px;
  }
  .mr15 {
    margin-right: 15px;
  }
  .search {
    width: 88px;
    color: #fff;
    margin-left: 0 !important;
  }
}

.flex {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.flex-center {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.list_wrap {
  margin-top: 20px;
}
.top {
  width: 100%;
  height: 40px;
  margin-top: 10px;
  .title {
    float: left;
    font-family: PingFangSC-Regular;
    font-size: 18px;
    font-weight: 600;
  }
}
.legend-line {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 10px;
  .item1 {
    display: flex;
    align-items: center;
    .txt {
      margin-left: 5px;
      font-size: 16px;
      font-family: "MicrosoftYaHei", "Microsoft YaHei";
      color: #707070;
    }
  }
  .item1:nth-of-type(1) {
    margin-right: 20px;
  }
}
.left-box {
  width: 200px;
  min-width: 200px;
  border-right: 1px #e2e8ec solid;
  height: calc(100vh - 250px);
  max-height: calc(100vh - 250px);
  padding-right: 10px;
  // overflow-y: auto;
  overflow: auto;
  p {
    cursor: pointer;
    font-size: 14px;
  }
}
.right-box {
  width: calc(100% - 250px);
  padding-left: 15px;
  flex-grow: 1;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
</style>

